.c7n-log {
  padding: 12px 10px 12px 27px;
  border-left: 3px solid transparent;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  position: relative;
  margin-left: 26px;

  .line-justify {
    display: flex;
    justify-content: space-between;
    align-items: center;

    .c7n-title-log {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
    }

    .c7n-action {
      display: flex;
      align-items: center;
      opacity: 0;
      font-size: 16px;
    }
    .mlr-3 {
      margin-left: 3px;
      margin-right: 3px;
    }

    .pointer {
      cursor: pointer;
    }
  }

  .line-start {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .c7n-conent-log {
    p {
      margin-bottom: 0;
    }
  }

  ul,
  ol {
    padding-left: 27px;
  }

  &:hover {
    background: rgba(0, 0, 0, 0.03);
    border-left-color: #303f9f;
    transition: all 1s;

    .c7n-action {
      opacity: 1;
      transition: opacity 2s;
    }
  }
}

.c7n-log-focus {
  background: rgba(0, 0, 0, 0.03);
  border-left-color: #303f9f;
}
